<template>
    <div>

        <v-affix>
			<div class="search-container">
				<search-box></search-box>
			</div>
		</v-affix>

        <div class="search-res-container">
            <jhs-item-card v-for="(item, index) in jhsitems" :key="index" :itemInfo="item"></jhs-item-card>
        </div>

        <home></home>
    </div>
    
</template>
<script>
import wx from 'weixin-js-sdk'
export default {
    name: 'jhsitems',
    data() {
        return {
            pageNo: 1,
            jhsitems: [],
            onLoading: false,
        }
    },
    mounted: function() {
        this.getJhsItems(function(){})
        this.scroll()
        this.getSignPackage()
    },
    activated: function() {
        this.getSignPackage()
    },
    methods: {
        getJhsItems: function(callback) {
            let that = this
            console.log(this.pageNo)
            this.axios.get(`/api/item/jhsitems?pageNo=${this.pageNo}`)
                .then(response => {
                    if (response.data.error) {
                        console.log(response.data.error)
                        callback()
						return
                    }
                    // console.log(response.data)
                    if (response.data.jhs_items) {
                        let items = response.data.jhs_items
                        for (let i = 0; i < items.length; i++) {
                            let tempItem = items[i]
                            let progress = parseInt((tempItem.stock - tempItem.remainStock) / tempItem.stock * 100)
                            tempItem.progress = progress
                            // console.log(progress)
                            that.jhsitems.push(tempItem)
                        }
                        callback()
                    }
                })
        },

        nextPageItems: function() {
            let that = this
            this.pageNo += 1
            this.getJhsItems(function(){
                that.onLoading = false
            })
        },

        scroll: function() {
            let that = this
            window.addEventListener('scroll', function() {
                if (!that.onLoading && (document.documentElement.offsetHeight + window.scrollY + 100 >= document.documentElement.scrollHeight)){
                    that.onLoading = true
                    that.nextPageItems()
                }
            })
        },

        getSignPackage: function() {
			let currentUrl = window.location.href
			console.log(currentUrl)
			let urlArr = currentUrl.split("#")
      		let url = encodeURIComponent(urlArr[0])
			this.axios.get(`getAccess.php?url=${url}`)
				.then(res => {
					console.log(res)
					this.setWxConfig(res.data)
				})
				.catch(error => {
					console.log(error)
				})
		},

		setWxConfig: function(data) {
			let currentUrl = window.location.href
			wx.config({
				debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
				appId: data.appId, // 必填，公众号的唯一标识
				timestamp: data.timestamp, // 必填，生成签名的时间戳
				nonceStr: data.nonceStr, // 必填，生成签名的随机串
				signature: data.signature,// 必填，签名
				jsApiList: [
					'onMenuShareTimeline',
					'onMenuShareAppMessage'
				] // 必填，需要使用的JS接口列表
			});
			wx.ready(function() {
				console.log('接口配置信息已经完成')
				wx.onMenuShareTimeline({
					title: '聚划算精选商品',
					link: currentUrl,
					imgUrl: 'http://neimengweixin.cdn.xianyugame.com/66game/youhuiquan.jpg',
					success: function() {
						console.log('用户点击按钮回调')
					}
				})

				wx.onMenuShareAppMessage({
					title: '聚划算精选商品', // 分享标题
					desc: `点击查看聚划算精选商品`, // 分享描述
					link: currentUrl, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
					imgUrl: 'http://neimengweixin.cdn.xianyugame.com/66game/youhuiquan.jpg', // 分享图标
					type: '', // 分享类型,music、video或link，不填默认为link
					dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
					success: function () {
						// 用户点击了分享后执行的回调函数
						console.log('用户点击了分享给朋友按钮')
					}
				})
			})
		},
    }
}
</script>
